<template>
	<view>
		<view class="scanCode_con u-text-center">
			<image src="https://resourse.cnlhjt.com/upload/20220824/2059dd18f33510d27721db16320b4663.png" @click="scanCode"></image>
			<view>扫一扫随时随地更新巡查情况</view>
		</view>
		<view class="u-padding-30">
			<view class="title">今日巡更</view>
			<view class="u-flex u-row-between">
				<view class="flex_list" @click="patrolList(99)">
					<view>{{list.total}}</view>
					<view>巡更点</view>
				</view>
				<view class="flex_list" @click="patrolList(1)">
					<view>{{list.complete}}</view>
					<view>已巡更</view>
				</view>
				<view class="flex_list" @click="patrolList(0)">
					<view>{{list.incomplete}}</view>
					<view>未巡更</view>
				</view>
			</view>
			<view class="title">巡查结果</view>
			<view class="u-flex u-row-between">
				<view class="flex_list flex_list1 blue_bg" @click="patrolList(2)">
					<view>{{list.normal}}</view>
					<view>正常</view>
				</view>
				<view class="flex_list flex_list1 red_bg" @click="patrolList(-1)">
					<view>{{list.abnormal}}</view>
					<view>异常</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getPatrolStatic
	} from "@/service/patrolService.js";
	export default {
		data () {
			return {
				list:{
					total:0,
					complete:0,
					incomplete:0,
					normal:0,
					abnormal:0
				}
			}
		},
		mounted() {
			
		},
		onShow() {
			getPatrolStatic().then(this.getPatrolStatic);
		},
		methods:{
			getPatrolStatic(e) {
				// console.log(e)
				if (e.code == 200) {
					this.list=e.result;
				}
			},
			scanCode:function(){
				// var code='YLThCw725';
				// uni.navigateTo({
				// 	url:'./formPatrolDetail?code='+code
				// })
				uni.scanCode({
					success(res) {
						let code=res.result;
						uni.navigateTo({
							url:'./formPatrolDetail?code='+code
						})
					}
				})
			},
			patrolList:function(status){
				uni.navigateTo({
					url:'./patrolList?status='+status
				})
			}
		}
	}
</script>

<style lang="scss">
	.scanCode_con{
		height:500rpx;
		color:#fff;
		background-color: #0c838b;
		border-bottom-left-radius:65% 35%;
		border-bottom-right-radius: 65% 35%;
	}
	.scanCode_con image{
		width:250rpx;
		height:250rpx;
		margin:80rpx auto 20rpx;
		border-radius: 50%;
	}
	.title{
		margin:40rpx 0 20rpx;
		font-size: 32rpx;
		font-weight: bold;
	}
	.flex_list{
		width:30%;
		color:#555;
		text-align: center;
		padding:30rpx 0;
		font-size: 25rpx;
		border-radius: 20rpx;
		background-color: #f3f6f6;
	}
	.flex_list view:first-child{
		font-size: 40rpx;
		font-weight: bold;
		color:#0c838b;
		margin-bottom:10rpx;
	}
	.flex_list1{
		width:47%;
	}
	.blue_bg{
		background-color: #d0ffda;
	}
	.red_bg{
		background-color: #ffe6e4;
	}
	.blue_bg view:first-child{
		color:#38a253;
	}
	.red_bg view:first-child{
		color:#b92518;
	}
</style>
